<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>发布职业</title>
    <link rel="stylesheet" href="/index.css"/>
    <script src="/js/vue.js"></script>
    <script src="/index.js"></script>
    <script src="/js/axios.min.js"></script>
    <script src="/js/city.js"></script>
</head>
<body>
<div id="app">
    <div class="container">
        <el-form  label-width="125px" >
            <el-form-item label="行业领域">
                <el-input v-model="position.company_type" ></el-input>
            </el-form-item>
            <el-form-item label="开发职位类型">
                <el-select v-model="position.job_type" placeholder="">
                    <el-option label="技术" value="技术"></el-option>
                    <el-option label="产品类" value="产品类"></el-option>
                    <el-option label="设计类" value="设计类"></el-option>
                    <el-option label="运营类" value="运营类"></el-option>
                    <el-option label="市场与营销" value="市场与营销"></el-option>
                    <el-option label="职能" value="职能"></el-option>
                    <el-option label="金融类" value="金融类"></el-option>
                </el-select>
            </el-form-item>
            <el-form-item label="发布职业">
                <el-input v-model="position.job" ></el-input>
            </el-form-item>
            <el-form-item label="经验要求">
                <el-input v-model="position.experience" ></el-input>
            </el-form-item>
            <el-form-item label="学历要求">
                <el-select v-model="position.education" placeholder="">
                    <el-option label="中专" value="中专"></el-option>
                    <el-option label="大专" value="大专"></el-option>
                    <el-option label="本科" value="本科"></el-option>
                    <el-option label="硕士" value="硕士"></el-option>
                    <el-option label="博士" value="博士"></el-option>
                    <el-option label="其他" value="其他"></el-option>
                </el-select>
            </el-form-item>
            <el-form-item label="需要工作时间">
                    <el-select v-model="position.company_time" placeholder="">
                        <el-option label="工作日" value="工作日"></el-option>
                        <el-option label="周末" value="周末"></el-option>
                    </el-select>
            </el-form-item>
            <el-form-item label="期望薪资">
                <el-input v-model="position.job_pay" ></el-input>
            </el-form-item>
            <el-form-item label="工作内容说明">
                <el-input
                        type="textarea"
                        :rows="7"
                        placeholder="请输入内容"
                        v-model="position.job_duties">
                </el-input>
            </el-form-item>
            <el-form-item label="可工作区域">
                <el-radio v-model="position.company_site" label="驻场">驻场工作</el-radio>
                <el-radio v-model="position.company_site" label="远程">远程工作</el-radio>
            </el-form-item>
            <el-form-item>
                <el-button type="primary" @click="addPosition">发布需求</el-button>
                <el-button type="info" @click="">取消</el-button>
            </el-form-item>
        </el-form>
    </div>
</div>

</body>
</html>
<script>
    var vm=new Vue({
        el: "#app",
        data: {
            position:{
                company_id:window.localStorage.getItem("company_id"),
                company_name:window.localStorage.getItem("company_name"),
            },
            successList:[]
        },
        methods: {
            handleChange(val){
                console.log(val)
            },
            handleAvatarSuccess(res, file) {
                this.applicant_image_url = URL.createObjectURL(file.raw);
            },
            beforeAvatarUpload(file) {
                const isJPG = file.type === 'image/jpeg';
                const isLt2M = file.size / 1024 / 1024 < 2;

                if (!isJPG) {
                    this.$message.error('上传头像图片只能是 JPG 格式!');
                }
                if (!isLt2M) {
                    this.$message.error('上传头像图片大小不能超过 2MB!');
                }
                return isJPG && isLt2M;
            },
            addPosition:function(){
                var company_id = window.localStorage.getItem("company_id")
                var company_name = window.localStorage.getItem("company_name")
                var company_state = window.localStorage.getItem("company_state")
                console.log(this.position)
                console.log(company_state)
                if(company_state == "审核通过") {
                        axios.post('/position/add', this.position)
                            .then(function (response) {
                                console.log(response.data);
                                if (response.data == 1) {
                                    alert(company_name)
                                    alert("发布成功！")
                                    location.href = "13.html"
                                }
                            })
                            .catch(function (error) {
                                console.log(error);
                            });
                    } else {
                        alert("请完成企业认证并等待审核通过！")
                    }
                // }
            },
            // successPosition:function (){
            //     console.log(this.company_id)
            //     axios.post('/position/success',{companyID:this.position.company_id})
            //         .then(function (response) {
            //             console.log(response.data);
            //             var code = response.data
            //             if(code=="200"){
            //                 alert("公司审核通过！")
            //
            //             }else{
            //                 alert("请等待审核通过！")
            //             }
            //         })
            //         .catch(function (error) {
            //             console.log(error);
            //         });
            // }

        },
        mounted() {
            var _this = this
            var company_id = window.localStorage.getItem("company_id")
            console.log("主键为："+ company_id)
            axios.get('/company/list')
                .then(function (response) {
                    _this.company = response.data
                    console.log(_this.company);
                })
                .catch(function (error) {
                    console.log(error);
                });

            axios.get('/position/success')
                .then(function (response) {
                    _this.successList = response.data
                    console.log(_this.successList);
                })
                .catch(function (error) {
                    console.log(error);
                });

        },
    })

</script>

<style>
    .container{
        position: absolute;
        top: 55%;
        left: 50%;
        -webkit-transform: translate(-50%, -50%);
        -moz-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
        -o-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
    }
    .el-main {
        background-color: #E9EEF3;
        color: #333;
        text-align: center;
        line-height: 160px;
    }
    .el-input{
        width:700px;
    }
    body > .el-container {
        margin-bottom: 40px;
    }

    .el-container:nth-child(5) .el-aside,
    .el-container:nth-child(6) .el-aside {
        line-height: 260px;
    }

    .el-container:nth-child(7) .el-aside {
        line-height: 320px;
    }

    .linkage {display: flex;}

    div { margin-right: 5px }

    .avatar-uploader .el-upload {
        border: 1px dashed #d9d9d9;
        border-radius: 6px;
        cursor: pointer;
        position: relative;
        overflow: hidden;
    }
    .avatar-uploader .el-upload:hover {
        border-color: #409EFF;
    }
    .avatar-uploader-icon {
        font-size: 28px;
        color: #8c939d;
        width: 178px;
        height: 178px;
        line-height: 178px;
        text-align: center;
    }
    .avatar {
        width: 178px;
        height: 178px;
        display: block;
    }
    .user-icon-tips{
        color:red;
    }
</style>
